<script setup lang="tsx">
import { ContentWrap } from '@/components/ContentWrap'
import { ElInput, ElSelect, ElOption } from 'element-plus'
import { regApi } from '@/api/login'
import { ref } from 'vue'
import { onMounted } from 'vue';
import { getClassNameApi } from '@/api/table';
const username = ref('')
const password = ref('')
const email = ref('')
const value = ref('')
const mobile = ref('')
const list = () => {
  const formData = {
    username: username.value,
    password: password.value,
    email: email.value,
    mobile: mobile.value,
    cid:value.value
  }
  const res = regApi(formData)
}
const classList = ref(null)
onMounted(()=>{
  getClassNameApi({pageIndex:1,pageSize:10}).then(res=>{
    classList.value = res.data.list
  })
})
</script>
<template>
  <ContentWrap title="添加">
    <el-input v-model="username" name="username" placeholder="请输入用户名" />
    <el-input v-model="password" name="password" placeholder="请输入昵称" />
    <el-input v-model="email" name="email" placeholder="请输入邮箱" />
    <el-input v-model="mobile" name="mobile" placeholder="请输入手机号" />
    <el-select v-model="value">
      <div v-for="item in classList">
        <el-option :label="item.name+item.bak" :value="item.name+item.bak"></el-option>
      </div>
    </el-select>
    <BaseButton @click="list">添加</BaseButton>
  </ContentWrap>
</template>

<style lang="less" scoped>
.el-button {
  margin-top: 10px;
}
</style>
